<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
	<head>
		<title>ContactServer</title>

		<link rel="stylesheet" href="css/adressbook.css" type="text/css" />

		<script src="lib/prototype.js" type="text/javascript"></script>
		<script src="lib/scriptaculous.js" type="text/javascript"></script>
		<script src="lib/md5.js" type="text/javascript"></script>
		<script src="lib/addressbook.js" type="text/javascript"></script>

		<script type="text/javascript">

			var bShowDetailView = true;

			var hoverColor_Contact = '#C3D3F2';
			var hoverColor_Group = '#C3D3F2';
			var selectColor_Contact = '#8FAEF4';
			var selectColor_Group = '#8FAEF4';

			var groupListClass = 'groupList';
			var contactListClass = 'contactList';
			var groupItemClass = 'groupItem';
			var contactItemClass = 'contactItem';
			var contactDetailsClass = 'contactDetails';

			var m_Addressbook = undefined;

			function Init()
			{
				//XMLHTTP request
				var adressBookDesign = new AdressBookDesign(
							groupListClass,
							contactListClass,
							groupItemClass,
							contactItemClass,
							contactDetailsClass,
							'#C3D3F2', // group Hover Color
							'#C3D3F2', // contact Hover Color
							'#8FAEF4', // group Select Color,
							'#8FAEF4'  // contact Select Color
							);

				m_Addressbook = new AdressBook(
						errorhandler,
						statushandler,
						debughandler,
						'divGrouplist',
						'divContactList',
						'divContactDetail',
						'divLoginScreen',
						'divLoginScreenDialog',
						adressBookDesign,
						loginstatushandler
						);
			}

			function errorhandler(msg)
			{
				alert('errorhandler ' + msg);
			}

			function statushandler(showmsg, msg)
			{
				if (showmsg)
				{
					$('divStatusMessage').innerHTML = '<span style="width: 200px; overflow: hidden;">'+msg + '</span><br/><img src="img/loader03.gif" alt=""/>';
					$('divStatusMessage').style.display = '';
				}
				else
				{
					//$('divStatusMessage').style.display = 'none';
				}
			}

			function debughandler(msg)
			{
				alert('debughandler ' + msg);
			}

			function loginstatushandler(msg)
			{
				alert('loginstatushandler ' + msg);
			}

		</script>
	</head>
	<body onload="window.setTimeout(Init,200);">

		<div id="divGrouplist">divGrouplist</div>
		<div id="divContactList">divContactList</div>
		<div id="divContactDetail">divContactDetail</div>
		<div id="divLoginScreen">divLoginScreen</div>
		<div id="divLoginScreenDialog">divLoginScreenDialog</div>
		<div id="divStatusMessage" Style="margin-left: 50%; padding: 10px; background-color: white; text-align: center; width: 200px; border: 1px solid gray;">&nbsp;</div>

	</body>
</html>
